<template>
  <!-- 对话框 -->
  <submit-dialog
    v-model:dialogVisibleModel="dialogVisible"
    :dialogTitle="props.dialogTitle"
    @submit="handleSaveOrUpdateSubmit"
    @reset="resetForm"
  >
    <template #rows>
      <!-- 表单 -->
      <el-form
        ref="ruleFormRef"
        style="max-width: 600px"
        :model="formData"
        status-icon
        label-width="auto"
        class=""
      >
        <!-- 代码生成区域 -->
        <el-form-item label="审核项目id" prop="id">
          <el-input v-model="formData.id" autocomplete="off" />
        </el-form-item>
        <el-form-item label="稿件标题" prop="title">
          <el-input v-model="formData.title" autocomplete="off" />
        </el-form-item>
        <el-form-item label="投稿信息简介" prop="briefIntroduction">
          <el-input v-model="formData.briefIntroduction" autocomplete="off" />
        </el-form-item>
        <el-form-item label="稿件url资源地址" prop="url">
          <el-input v-model="formData.url" autocomplete="off" />
        </el-form-item>
        <el-form-item label="稿件URL" prop="url">
          <upload-file-box v-model:fileUrl="formData.url"></upload-file-box>
        </el-form-item>
        <el-form-item label="简介" prop="summary">
          <el-input v-model="formData.summary" autocomplete="off" />
        </el-form-item>
        <el-form-item label="用户id" prop="userId">
          <el-input v-model="formData.userId" autocomplete="off" />
        </el-form-item>
        <el-form-item label="封面URL" prop="picture">
          <el-input v-model="formData.picture" autocomplete="off" />
        </el-form-item>
        <el-form-item label="稿件id" prop="contributeId">
          <el-input v-model="formData.contributeId" autocomplete="off" />
        </el-form-item>
        <el-form-item label="审核状态" prop="judgeStatus">
          <el-input v-model="formData.judgeStatus" autocomplete="off" />
        </el-form-item>
        <el-form-item label="创建人" prop="createdBy">
          <el-input v-model="formData.createdBy" autocomplete="off" />
        </el-form-item>
        <el-form-item label="创建时间" prop="createTime">
          <el-input v-model="formData.createTime" autocomplete="off" />
        </el-form-item>
        <el-form-item label="更新人" prop="updatedBy">
          <el-input v-model="formData.updatedBy" autocomplete="off" />
        </el-form-item>
        <el-form-item label="更新时间" prop="updateTime">
          <el-input v-model="formData.updateTime" autocomplete="off" />
        </el-form-item>
      </el-form>
    </template>
  </submit-dialog>
</template>

<script setup>
/*
专用于：contributejudge.vue 的 子组件--用于submit提交使用
*/

import { ref } from "vue";
import {
  addContributejudge,
  getContributejudge,
  updateContributejudge,
  listContributejudge,
  deleteContributejudge,
} from "@/api/content/contributejudge/contributejudge.js";
import { ElMessageBox } from "element-plus";
import { Contributejudge } from "@/model/contributejudge.d.js";
import { onMounted, watch } from "vue";
import { checkResult } from "@/utils/Rutil.js";
import uploadFileBox from "@/components/uploadFileBox/uploadFileBox.vue";

const update = "update";

const emit = defineEmits(["refreshList"]);

// 传入id
const props = defineProps({
  id: {
    default: null,
  },
  type: {
    /* 类型有 insert 和 update*/
    default: "insert",
  },
  dialogTitle: {
    default: "title",
  },
});

// 定义给父亲组件
// 是否显示此dialog
// const dialogVisible = ref(false);
const dialogVisible = defineModel("dialogVisible", {
  default: false,
});

// 重置表单数据
const resetForm = () => {
  // 调用组件对象的时候，也需要使用value
  ruleFormRef.value.resetFields();
};

// 表单数据
const formData = ref(new Contributejudge());
// el-dialog实体
const ruleFormRef = ref();
// 表单提交handle
const handleSaveOrUpdateSubmit = async () => {
  console.log("formData", formData.value);
  var codeCheck = false;
  if (props.type === "insert") {
    const res = await addContributejudge(formData.value);
    console.log("handleSaveOrUpdateSubmit-addContributejudge-res", res);
    codeCheck = checkResult(res);
  } else if (props.type === update) {
    const res = await updateContributejudge(formData.value);
    console.log("handleSaveOrUpdateSubmit-updateContributejudge-res", res);
    codeCheck = checkResult(res);
  }

  if (codeCheck) {
    dialogVisible.value = false;
    ElMessageBox({ message: "提交成功", type: "success" });
    resetForm();
  } else {
    ElMessageBox({ message: "提交失败", type: "error" });
  }
  emit("refreshList");
};

// 可以直接侦听dialogVisible，实现点击获取表单更新数据
watch(dialogVisible, async (newValue, oldValue) => {
  console.log("submit.vue is now Opened.");
  if (newValue === true && props.type === update && props.id !== null) {
    //   如果是修改，可以使用这个函数
    const res = await getContributejudge(props.id);
    console.log("getContributejudge-data", res.data);
    formData.value = res.data;
  }
});
// 暂时不需要使用
onMounted(async () => {});
</script>

<style lang="scss"></style>
